<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="{$Think.config.RESOURCEURL}wx_assets/css/website/photo.css" media="all">
	<link rel="stylesheet" type="text/css" href="{$Think.config.RESOURCEURL}wx_assets/css/website/photo_polaroid/photoswipe.css" media="all"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jQuery.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jquery_imagesloaded.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jquery_wookmark_min.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/website/klass_min.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/website/code_photoswipe_min.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jquery_lazyload.js"></script>
<title>{$title}</title>
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">

<!-- Mobile Devices Support @begin1 -->

<meta content="telephone=no, address=no" name="format-detection">
<meta name="apple-mobile-web-app-capable" content="yes">
<!-- apple devices fullscreen -->
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<!-- Mobile Devices Support @end -->


<style>
img{max-width:100%!important;}
#Gallery li
{
	width: 140px;
}
#Gallery li img
{
	width: 138px;
	height: 100px;
}
</style>
</head>
<body onselectstart="return true;" ondragstart="return false;" id="photo">
<script type="text/javascript">
		(function(window){
			document.addEventListener('DOMContentLoaded', function(){
				var PhotoSwipe = window.Code.PhotoSwipe;
				var options = {loop:false},
				instance = PhotoSwipe.attach( window.document.querySelectorAll('#Gallery a'), options );
			}, false);
			})(window);
	</script>
<div class="body">
	<eq name="MainArticles[0].picurl">
		<else />
		<div class="qiandaobanner">
			<a href="{$MainArticles[0].picurl}">
				<img src="{$MainArticles[0].picurl}" alt="" style="max-height:200px;" class="shareImgUrl"></a>
		</div>
	</eq>
	<div id="main" role="main" style="height: 566px;">
		<ul id="Gallery" class="gallery">
			<volist name="ModuleArticles" id="m">
				<li>
					<a href="{$m.picurl}">
						<img src="{$m.picurl}" alt="">
					</a>
				</li>
			</volist>
		</ul>
	</div>
</div>
<!--下面是瀑布流js-->

<script type="text/javascript">
    (function ($){
      $('#Gallery').imagesLoaded(function() {
        // Prepare layout options.
        var options = {
          autoResize: true, // This will auto-update the layout when the browser window is resized.
          container: $('#main'), // Optional, used for some extra CSS styling
          offset: 4, // Optional, the distance between grid items
          itemWidth: 150 // Optional, the width of a grid item
        };

        // Get a reference to your grid items.
        var handler = $('#Gallery li');
        // Call the layout function.
        handler.wookmark(options);
      });
    })(jQuery);
  </script>
  <eq name="NavBottom[0].url" value="">
 	<else />
  	<footer style="text-align:center; color:#ffd800;margin-right:20px;margin-top:0px;">
  		<a href="{$NavBottom[0].url}">{$NavBottom[0].title}</a>
  	</footer>
  </eq>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}"></script>
<script type="text/javascript">
	wx_share.init({
		"title":"{$title}",
		"desc":'{$shareinfo}',
		"link":location.href,
		"imgUrl": '{$sharepicurl}',
		"pkg":{
			"appId": '{$pkg.appId}',
			"timestamp": '{$pkg.timestamp}',
			"nonceStr": '{$pkg.nonceStr}',
			"signature": '{$pkg.signature}'
		},
		success:function(config,shareType){
		}
	});
</script>
</body>
</html>